<template>
    <view class="tags" :style="{ '--backColor': backColor }">
        {{ text }}
    </view>
</template>

<script setup lang="ts">
interface propInt {
    text: string
    backColor?: string
}

 withDefaults(defineProps<propInt>(), {
    text: '',
    backColor: '#4b81fb'
})
</script>

<style lang="scss" scoped>
.tags {
    position: relative;
    margin: 10rpx 0 20rpx;
    padding-left: 26rpx;
    font-size: 28rpx;
    color: #28211f;

    &::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 8rpx;
        height: 100%;
        background: var(--back-color) !important;
    }
}
</style>